<template>
	<view class="body">
		<!-- 新增月初计划任务(小组组长给组员分配任务) -->
		<myHeader :title="title"></myHeader>

		<!-- 新增 -->
		<view class="mt-20 p-20">
			<!-- 分配任务给组长 -->
			<view class="">
				<uni-icons type="plus" size="26" color="#C0C0C0" @click="addInner()"></uni-icons>
			</view>
			<view class="mt-20">
				<view v-for="(tab,index) in tabs" :key="index">
					<view class="mt-10 p-10 group">
						<uni-easyinput class="p-5" type="text" v-model="tab.taskName" placeholder="请输入分解任务名" />
						<uni-easyinput class="p-5" type="text" v-model="tab.taskScore" placeholder="请输入分数" />
						<uni-forms-item class="p-5" required name="header" label="负责人">
							<picker @change="bindPickerChange($event,candidates, tab)" :range="candidates"
								:range-key="'memberName'">
								<view class="uni-input">{{candidates[tab.idx].memberName}}</view>
							</picker>
						</uni-forms-item>
						<uni-icons type="minus" size="26" color="#C0C0C0" @click="remove(index)"></uni-icons>
					</view>

				</view>
			</view>

			<!-- 图片上传 -->
			<!-- 	<uni-file-picker limit="1" :auto-upload="true" mode="list" file-mediatype="all" @select="select">
			</uni-file-picker>
			<progress v-if="progressVal != 0" activeColor="#4CAF50" :percent="progressVal" stroke-width="10"></progress>
 -->
			<view class="mt-20 ">
				<button class="bg-red text-white" @click="submit">提交</button>
			</view>
		</view>
	</view>
</template>

<script>
	import myHeader from '../../components/head.vue'
	import NetWorkTool from '@/api/netWorkTool'
	import axios from 'axios'
	export default {
		data() {
			return {
				title: '分配任务',
				startMonthId: '',
				index: 1,
				// 下拉框候选
				candidates: [{
					memberId: 0,
					memberName: '请选择',
					createTime: null,
					id: 1,
					leader: 1,
					leaderName: null,
					members: null,
					teamName: "xx",
					updateTime: null,
				}],
				candidateIdx: 0,
				// 文件上传后的url
				fileUrl: '',
				progressVal: 0,
				imageValue: [],
				tabs: [{
					taskName: '',
					taskScore: '',
					executor: '',
					idx:0
				}],
				// 上级任务
				parentTask: ''
			}
		},
		onLoad: function(option) {
			this.startMonthId = option.startMonthId;
			this.parentTask = JSON.parse(option.data)
		},
		mounted() {
			this.getMembers();
		},
		methods: {
			submit() {
				for (let i in this.tabs){
					if(this.tabs[i].executor == "" ||this.tabs[i].executor == -1
					|| this.tabs[i].taskName == ""||this.tabs[i].taskScore == ""){
						uni.showToast({
							title: "请添加分解任务",
							duration: 3000,
							icon: 'none',
						});
						return
					}
				}
				// 从分解任务列表中移除默认选项
				for (let i in this.tabs){
					if(this.tabs[i].executor == -1 ){
						this.tabs.splice(i)
					}
				}
				let param = {
					"pid": this.parentTask.id,
					"startMonthId": this.startMonthId,
					"tasks": this.tabs
				}
				NetWorkTool.POST('/api/federation-start-month/decompose', param, true).then(res => {
					uni.showToast({
						title: res.message,
						duration: 2000
					});
					this.formData = {};
					uni.navigateTo({
						url: './monthStartPlan'
					})
				})
			},
			// 获取组员信息
			getMembers() {
				let leaderId = '';
				uni.getStorage({
					key: 'user',
					success(e) {
						leaderId = e.data.user.userId;
					}
				});

				NetWorkTool.POSTFORM('/api/federation-teams-relation/byleaderGetMembers', {
					leader: leaderId
				}, false).then(res => {
					if (false != res) {
						// for (let item of res) {
						// 	// this.candidates.push(item)
							
						// }
						this.candidates = res
					}
				});
			},

			// 获取上传状态
			select(e) {
				let source = e.tempFiles[0];
				let token = '';
				uni.getStorage({
					key: 'AuthToken',
					success(e) {
						token = e
					}
				})
				const uploadTask = uni.uploadFile({
					url: '/api/uploadFile', //仅为示例，非真实的接口地址
					filePath: e.tempFilePaths[0],
					name: 'file',
					header: {
						'x-access-token': token.data
					},
					formData: {
						'name': source.name,
						'size': source.size
					},
					success: (res) => {}
				});
				uploadTask.onProgressUpdate((res) => {
					this.progressVal = res.progress;
					this.fileUrl = res.url;
				});
			},

			// 选中后
			bindPickerChange(e, arr, tab) {
				tab.idx = e.target.value;
				tab.executor = arr[tab.idx].memberId;
			},
			addInner(e) {
				this.index += 1;
				this.tabs.push({
					taskName: '',
					taskScore: '',
					executor: '',
					idx: 0
				});
			},
			remove(index) {
				if (this.inde != -1) {
					this.tabs.splice(index, 1);
				}
			},
		},

		components: {
			myHeader
		},
	}
</script>

<style>
	@import url("/static/party_building/assets/style/federation.css");
</style>
